import * as THREE from 'three';
const loader = new THREE.FileLoader();
import {lon2xyz} from "./math.js"
loader.setResponseType('json');
const lineGroup = new THREE.Group();
const model = new THREE.Group();
var n = 3
//加载一个文本文件，并把结果输出到控制台上
loader.load('/world.json',function ( data ) {
  data.features.forEach((area) => {
  // coordinates数据分为单组和多组，将单组的封装为多组
    if(area.geometry.type === 'Polygon'){
        area.geometry.coordinates = [area.geometry.coordinates]
    }
    moreLine(area.geometry.coordinates)
  });
  lineGroup.add(oneLine(allPointArr)) 
})
// 地球体
var R = 100
const geometry = new THREE.SphereGeometry( R, 32, 16 );
const texture = new THREE.TextureLoader().load( '/earth.png');
const material = new THREE.MeshBasicMaterial( { map:texture });
const sphere = new THREE.Mesh( geometry, material );
const materialLine = new THREE.LineBasicMaterial({
  color: 0x00aaaa
});
// 所有边界线顶点坐标合并在一起(每个点都是复制一个)，适合使用LineSegments渲染
var allPointArr = [];
// 批量产生线框
const moreLine = (coordinates)=>{
  coordinates.forEach(polygon=>{
    // 某一个国家的某一个轮廓线的点数组
    var pointArr = []
    polygon[0].forEach(item=>{
      var point = lon2xyz(R,item[0],item[1]);
      // 经纬度不需要太高的精度
      pointArr.push(new THREE.Vector3(Number(point.x).toFixed(n),Number(point.y).toFixed(n),Number(point.z).toFixed(n)));
    })
    // 添加到总轮廓点数组中
    allPointArr.push(pointArr[0])//添加第一个
    pointArr.forEach((item,index)=>{//后面的每一个点都复制一个添加进去
      // 第一个点不复制
      if(index != 0){
        allPointArr.push(item,item)
      }
    })
    // 将第一个点添加最后一个
    allPointArr.push(pointArr[0])
  })
  // 将总的轮廓点数组传入LineSegments方法中,生成一个轮廓线
  // var LineSegments =  oneLine(allPointArr)
  // return LineSegments;
}
// 产生单个线框
var oneLine = (allPointArr)=>{
  const geometry = new THREE.BufferGeometry().setFromPoints( allPointArr );
  const line = new THREE.LineSegments( geometry, materialLine );
  line.position.x += 0.1;
  line.position.y += 0.1;
  line.position.z += 0.1;
  return line;
}
// 产生光圈精灵图
var sprint2 = ()=>{
  // 加载纹理贴图
  var textureSprint = new THREE.TextureLoader().load( '/地球光圈.png');
  // 产生精灵图
  var spriteMaterial = new THREE.SpriteMaterial({
    map: textureSprint,
    transparent: true,//开启透明
    color: 0xffffff,
  });
  var sprite = new THREE.Sprite( spriteMaterial );
  sprite.scale.set(300, 300, 1)
  return sprite
}
// 郑州经纬度坐标：113.4668, 33.8818
const ZZSprite = ()=>{
  const geometry = new THREE.PlaneGeometry(10, 10);
  //纹理贴图加载器TextureLoader
  const texLoader = new THREE.TextureLoader();
  const texture = texLoader.load('/贴图.png');
  const material = new THREE.MeshLambertMaterial({
      // 设置纹理贴图：Texture对象作为材质map属性的属性值
      map: texture,//map表示材质的颜色贴图属性
      transparent: true,
      side: THREE.DoubleSide,  
    });
  const mesh = new THREE.Mesh(geometry, material);
  mesh.position.copy(lon2xyz(R,113.4668, 33.8818));


  // 将标价点与地球相切
  const meshNormal = new THREE.Vector3(0,0,1)//标记点默认的法线是z轴
  // 标记点与球心的向量
  const meshPosition = mesh.position.clone().normalize()
  // 计算旋转轴，通过四元数属性实现从z轴到标记点与地球相切的旋转
  // 四元数属性.quaternion表示mesh的角度状态
  //.setFromUnitVectors();计算两个向量之间构成的四元数值
  mesh.quaternion.setFromUnitVectors(meshNormal, meshPosition);
  return mesh
}
model.add(sphere,lineGroup,sprint2(),ZZSprite());
export {model,sphere};